<template>
	<view class="user">
		<view class="userInfo">
			<view class="userInfo_left">
				<view class="">
					<image :src="userInfo.avatar" mode="" class="userInfo_img"></image></view>
				<view style="margin-left: 20rpx;">
					<view class="userInfo_name">{{userInfo.nickname ? userInfo.nickname : '微信用户'}}</view>
					<view class="userInfo_num">ID:12346789</view>
				</view>
			</view>
			<view class="userInfo_right" @click="login">
				<image src="../../static/images/gx.png" mode=""></image>
				<text>更新资料</text>
			</view>
		</view>
		<view class="list">
			<view class="list_meun" @click="tabPage(1)">
				<view class="list_num">{{userInfo.bm_count}}</view>
				<view class="list_name">报名</view>
			</view>
			<view class="list_meun" @click="tabPage(2)">
				<view class="list_num">{{userInfo.fq_count}}</view>
				<view class="list_name">发起</view>
			</view>
			<view class="list_meun" @click="tabPage(3)">
				<view class="list_num">{{userInfo.tp_count}}</view>
				<view class="list_name">投票</view>
			</view>
		</view>
		<view class="add" style="width: 100%;" @click="toAdd()"><image src="../../static/images/bg02.png" mode="widthFix" style="width: 100%;height: 100rpx;"></image></view>
		<view class="user_list">
			<view class="user_list_meun" @click="tabPage(4)">
				<view class="user_list_meun_left">
					<image src="../../static/images/type01.png" mode=""></image>
					<text>投票帮代言人</text>
				</view>
				<view class=""><image src="../../static/images/arrow.png" mode="" style="width: 30rpx;height: 30rpx;"></image></view>
			</view>
			<view class="user_list_meun" @click="tabPage(5)">
				<view class="user_list_meun_left">
					<image src="../../static/images/type02.png" mode=""></image>
					<text>个人主页</text>
				</view>
				<view class=""><image src="../../static/images/arrow.png" mode="" style="width: 30rpx;height: 30rpx;"></image></view>
			</view>
			<view class="user_list_meun" @click="tabPage(6)">
				<view class="user_list_meun_left">
					<image src="../../static/images/type03.png" mode=""></image>
					<text>客服/合作</text>
				</view>
				<view class=""><image src="../../static/images/arrow.png" mode="" style="width: 30rpx;height: 30rpx;"></image></view>
			</view>
			<view class="user_list_meun" @click="tabPage(7)">
				<view class="user_list_meun_left">
					<image src="../../static/images/type04.png" mode=""></image>
					<text>常见问题</text>
				</view>
				<view class=""><image src="../../static/images/arrow.png" mode="" style="width: 30rpx;height: 30rpx;"></image></view>
			</view>
			<view class="user_list_meun" @click="tabPage(8)">
				<view class="user_list_meun_left">
					<image src="../../static/images/type05.png" mode=""></image>
					<text>创建问卷</text>
				</view>
				<view class=""><image src="../../static/images/arrow.png" mode="" style="width: 30rpx;height: 30rpx;"></image></view>
			</view>
			<view class="user_list_meun" @click="tabPage(9)">
				<view class="user_list_meun_left">
					<image src="../../static/images/type06.png" mode=""></image>
					<text>发起抽奖</text>
				</view>
				<view class=""><image src="../../static/images/arrow.png" mode="" style="width: 30rpx;height: 30rpx;"></image></view>
			</view>
		</view>
	</view>
</template>

<script>
import { userInfoAPI } from '@/api/user';
export default {
	data() {
		return {
			userInfo:{}
		};
	},
	onShow() {
		this.getUser()
	},
	mounted() {},
	methods: {
		getUser(){
			var parems = {
				token:uni.getStorageSync('accessToken')
			}
			userInfoAPI(parems).then(res =>{
				if(res.code == 1){
					this.userInfo = res.data
				}else{
					if(res.code == 2){
						uni.showToast({
							title:res.data,
							icon:'none',
						})
						setTimeout(() => {
							uni.navigateTo({
								url:'../auth/auth'
							})
						}, 1000)
					}else{
						wx.showToast({
							title:res.msg,
							icon:'none'
						})
					}
				}
			})
		},
		toAdd() {
			uni.navigateTo({
				url: '../create/create'
			});
		},
		login() {
			let _self = this;
			uni.showLoading({
				title: '加载中...'
			});
			uni.getUserProfile({
			   desc: "用于完善会员资料", // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
			   success: res => {
			     let userInfo = res.userInfo
			     console.log(res)
				 uni.hideLoading()
			  },
			})
			// uni.login({
			// 	provider: 'weixin',
			// 	success: function(loginRes) {
			// 		let data = { code: loginRes.code };
					
			// 	}
			// });
		},
		tabPage(data) {
			if (data == 1 || data == 2 || data == 3) {
				uni.navigateTo({
					url: './typeList?type=' + data
				});
			} else if (data == 4) {
				uni.navigateTo({
					url: './endorsement'
				});
			} else if (data == 5) {
				uni.navigateTo({
					url: './userHome'
				});
			} else if (data == 6) {
				uni.showToast({
					icon: 'none',
					title: '跳转客服'
				});
			} else if (data == 7) {
				uni.showToast({
					icon: 'none',
					title: '跳转常见问题'
				});
			} else if (data == 8) {
				uni.showToast({
					icon: 'none',
					title: '跳转创建问卷'
				});
			} else if (data == 9) {
				uni.showToast({
					icon: 'none',
					title: '跳转发起抽奖'
				});
			}
		}
	}
};
</script>

<style lang="scss">
.user {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	.userInfo_img{
		width: 110rpx;
		height: 110rpx;
		background: #c0c4cc;
		border-radius: 50%;
	}
	.userInfo {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		height: 120rpx;
	}
	.userInfo_left {
		display: flex;
		align-items: center;
		padding-left: 30rpx;
	}
	.userInfo_name {
		font-size: 28rpx;
		color: #303133;
		font-weight: bold;
	}
	.userInfo_num {
		font-size: 24rpx;
		color: #c0c4cc;
		margin-top: 10rpx;
	}
	.userInfo_right {
		display: flex;
		align-items: center;
		background: #f3f4f6;
		padding: 10rpx 20rpx;
		border-radius: 100rpx 0 0 100rpx;
		image {
			width: 45rpx;
			height: 45rpx;
		}
		text {
			font-size: 26rpx;
			color: #303133;
			font-weight: 600;
			margin-left: 10rpx;
		}
	}
	.list {
		display: flex;
		align-items: center;
		justify-content: space-around;
		width: 100%;
		margin: 20rpx 0;
		.list_meun {
			width: 28%;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
		}
		.list_num {
			font-size: 28rpx;
			color: #333333;
			font-weight: bold;
		}
		.list_name {
			font-size: 26rpx;
			color: #9a9a9a;
			margin-top: 10rpx;
		}
	}
	.user_list {
		display: flex;
		flex-direction: column;
		width: 90%;
		.user_list_meun_left {
			display: flex;
			align-items: center;
		}
		.user_list_meun {
			display: flex;
			align-items: center;
			justify-content: space-between;
			width: 100%;
			height: 110rpx;
			border-bottom: 2rpx solid #eee;
			image {
				width: 60rpx;
				height: 60rpx;
			}
			text {
				font-size: 26rpx;
				color: #808080;
				margin-top: 10rpx;
				margin-left: 15rpx;
			}
		}
	}
}
</style>
